<template>
	<view>
		<view class="upload-image-view">
			<image class="image-view" :src="firstImg" mode="" @tap='chooseImage(0)'></image>
			<image class="image-view" :src="secondImg" mode="" @tap='chooseImage(1)'></image>
			<image class="image-view" :src="thirdImg" mode="" @tap='chooseImage(2)'></image>
		</view>
		<view class="upload-image-view">
			<view style="margin-left: 10rpx;"></view>
			<text class="image-view-title">车辆行驶证</text>
			<text class="image-view-title">个人驾驶证</text>
			<text class="image-view-title">车辆交强险</text>
		</view>
		<view class="upload-image-view">
			<image class="image-view" :src="fourthImg" mode="" @tap='chooseImage(3)'></image>
			<image class="image-view" :src="fifthImg" mode="" @tap='chooseImage(4)'></image>
			<image v-if="sixthImg != 0" class="image-view" :src="sixthImg" mode="" @tap='chooseImage(5)'></image>
		</view>
		<view class="upload-image-view">
			<view style="margin-left: 10rpx;"></view>
			<text class="image-view-title">身份证正面</text>
			<text class="image-view-title">身份证反面</text>
			<text v-if="sixthImg != 0" class="image-view-title">车辆正面照</text>
		</view>
		<view class="upload-image-view">
			<image v-if="otherImg != 0" class="image-view" :src="otherImg" mode="" @tap='chooseImage(6)'></image>
		</view>
		<view v-if="otherImg != 0" class="upload-image-view">
			<view style="margin-left: 10rpx;"></view>
			<text v-if="otherImg != 0" class="image-view-title">其它的材料</text>
		</view>
	</view>
</template>

<script>
	import {
		myUploadFile
	} from "../../util/network.js"
	var sourceType = [
		['camera'], //拍照
		['album'], //相册
		['camera', 'album'] //拍照或相册
	]
	var sizeType = [
		['compressed'], //压缩
		['original'], //原图
		['compressed', 'original'] //压缩或原图
	]
	export default {
		name:"access-card-img",
		data() {
			return {
				imageList:[this.firstImg,this.secondImg,this.thirdImg,this.fourthImg,this.fifthImg,this.sixthImg,this.otherImg,
				           this.firstImgId,this.secondImgId,this.thirdImgId,this.fourthImgId,this.fifthImgId,this.sixthImgId,this.otherImgId
				],
				isChangeIn:this.isChange,
			};
		},
		props: {
			firstImg: {
				type: String
			},
			secondImg:{
				type:String
			},
			thirdImg:{
				type:String
			},
			fourthImg: {
				type: String
			},
			fifthImg:{
				type:String
			},
			sixthImg:{
				type:String
			},
			otherImg:{
				type:String
			},
			isChange:{
				type: Boolean,
				default: false
			}
		},
		methods: {
			addImage(imageList){
				console.log("[info]","调试身份证上传图片，我是子组件"+imageList.toString())
				this.$emit("addImg",imageList.toString())
			},
		//选择图片
			chooseImage: function(index) {
				if(this.isChangeIn) {
					uni.chooseImage({
						sourceType: sourceType[1],
						// #ifdef MP-WEIXIN
						sizeType: sizeType[1],
						// #endif
						success: (res) => {
							let imgId = 0
							let a = myUploadFile(uni.getStorageSync('token'), res.tempFilePaths[0])
							 a.then((v)=>{
								 imgId = v
								 this.imageList[index] = res.tempFilePaths[0];
								 this.imageList[index + 7] = imgId;
								 this.addImage(this.imageList);
							})
						}
					})
				}else{
					let temp = []
					if(this.otherImg == 0){
						temp =[this.firstImg,this.secondImg,this.thirdImg,this.fourthImg,this.fifthImg,this.sixthImg]
					}else{
						temp =[this.firstImg,this.secondImg,this.thirdImg,this.fourthImg,this.fifthImg,this.sixthImg,this.otherImg]
					}
					uni.previewImage({
						current: index,
						urls: temp,
					})
				}
			}
				//预览图片
				// previewImage: function(e) {
				// 	var current = e.target.dataset.src
				// 	uni.previewImage({
				// 		current: current,
				// 		urls: this.imageList
				// 	})
				// },
				// //删除图片
				// deleteImage: function(e) {
				// 	var index = e.target.dataset.index;
				// 	var that = this;
				// 	var images = that.imageList;
				// 	images.splice(index, 1);
				// 	that.imageList = images;
				// }
		}
	}
</script>

<style>
	@import "../../static/css/upload-imgs.css";

</style>
